<template>
  <view>
    <swiper
      
      :class="classA==='class-a' ? 'class-a' : 'class-b'"
      indicatorColor="white"
      indicatorActiveColor="#333"
      current="current"
      :duration="duration"
      :interval="interval"
      :circular="isCircular"
      :autoplay="isAutoplay"
      :indicatorDots="hasIndicatorDots"
    >
      <swiper-item v-for="(item,idx) in imgUrls" :key="idx">
        <navigator :url='item.link' class="slide-image">
          <image :src='item.url' class="slide-image" />
        </navigator>
      </swiper-item>
    </swiper>
  </view>
</template>

<script>
import Taro from "@tarojs/taro";
export default {
  props:['classA'],
  data() {
    return {
      current: 1,
      duration: 500,
      interval: 5000,
      isCircular: true,
      isAutoplay: true,
      hasIndicatorDots: true,
      imgUrls: [{
        link:"/pages/overseasHighSchoolPage/index",
        url:"https://pic3.zhimg.com/v2-58d652598269710fa67ec8d1c88d8f03_r.jpg?source=1940ef5c",
      },{
        link:"/pages/list/index",
        url:"https://www.keaidian.com/uploads/allimg/190424/24110307_6.jpg",
      }],
    };
  },
  methods:{
  
  }
};
</script>

<style>
.class-a {
  width: 100%;
  height: 300px;
  z-index: -1;

}

.slide-image {
  width: 100%;
  height: 100%;
}
.class-b {
  width: 100%;
  height: 370px;
  z-index: -1;
}
</style>
